<template>
	<view class="splash-container">
		<view class="logo-section">
			<view class="logo">
				<image class="logo-img" :src="logoSrc" mode="aspectFit"></image>
			</view>
			<view class="title-section">
				<text class="main-title">舞动智韵</text>
				<text class="sub-title">WUDONGZHIYUN</text>
			</view>
		</view>
		<view class="enter-section">
			<text class="enter-text" @tap="goToHome">点击进入</text>
		</view>
	</view>
</template>

<script>
export default {
	name: 'Splash',
	data() {
		return {
			logoSrc: require('../../static/bg-logo.png')
		}
	},
	methods: {
		goToHome() {
			uni.navigateTo({
				url: '/pages/login/login'
			});
		}
	}
}
</script>

<style scoped>
.splash-container {
	width: 100vw;
	height: 100vh;
	background: linear-gradient(135deg, #FF6B9D 0%, #FFB6C1 100%);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	padding: 120rpx 60rpx 100rpx;
	box-sizing: border-box;
}

.logo-section {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.logo {
	
	display: flex;
	align-items: center;
	justify-content: center;
	
}
.logo img{
		width: 140rpx;
		height: 140rpx;
	}

.logo-text {
	font-size: 100rpx;
}

.title-section {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.main-title {
	font-size: 64rpx;
	font-weight: bold;
	color: #FFFFFF;
	margin-bottom: 20rpx;
	letter-spacing: 4rpx;
}

.sub-title {
	font-size: 32rpx;
	color: rgba(255, 255, 255, 0.8);
	letter-spacing: 2rpx;
}

.enter-section {
	margin-bottom: 40rpx;
}

.enter-text {
	font-size: 32rpx;
	color: rgba(255, 255, 255, 0.9);
	padding: 20rpx 0;
	border-bottom: 2rpx solid rgba(255, 255, 255, 0.5);
}
</style> 